<template>
  <div>
    <section class="flex  justify-end">
      <el-button
        type="primary"
        style="margin-bottom:10px ;margin-right:4px"
        @click="deBounceWrap(handleImport)"
        >导入系统</el-button
      >
    </section>
    <el-table :data="tableData" style="width: 100%" height="700" border>
      <el-table-column prop="ctr_dir" label="控制器目录"> </el-table-column>
      <el-table-column prop="ctr" label="控制器"> </el-table-column>
      <el-table-column prop="action" label="方法名"> </el-table-column>
      <el-table-column prop="uri" label="路由地址"> </el-table-column>
      <el-table-column prop="method" label="请求方式"> </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { newRouteList, exportRoute } from "@/api/routingList/routingList";
export default {
  data() {
    return {
      tableData: []
    };
  },
  created() {
    this.getList();
  },
  methods: {
    getList() {
      newRouteList().then(res => {
        this.tableData = res.data;
      });
    },
    //导入
    handleImport() {
      this.$confirm("是否将列表数据导入系统？", "提示", {
        distinguishCancelAndClose: true,
        confirmButtonText: "保存",
        cancelButtonText: "取消"
      })
        .then(() => {
          exportRoute().then(() => {
            this.$message({
              type: "success",
              message: "操作成功"
            });
            this.getList();
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消操作"
          });
        });
    }
  }
};
</script>
